<template>
  <div id="app">
    <navBar />
    <keep-alive v-if="$route.meta.keepAlive">
      <router-view />
    </keep-alive>
    <router-view v-else />

    <tabBar />
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import tabBar from '@/components/tab-bar.vue'
import navBar from '@/components/nav-bar.vue'
export default defineComponent({
  components: {
    tabBar,
    navBar
  }
})
</script>


<style>
#app {
  position: relative;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #333;
  font: .375rem 宋体 Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;
  background-color: #f9f9f9;
  height: 100%;
}

html, body {
  height: 100%;
  background-color: #f9f9f9;
}

* {
  box-sizing: border-box;
}
</style>